<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title"  :width="300" @ok="handleSubmit">
    <QrCode :value="qrCodeUrl" :width="280" />
 </BasicModal>
</template>

<script lang="ts" setup>
import { ref, computed, unref } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { FormSchema, useForm, BasicForm } from '/@/components/Form';
import { QrCode, QrCodeActionType } from '/@/components/Qrcode/index';
import { nativePay } from '../wxApi';
import { useMessage } from '/@/hooks/web/useMessage'; // 轻提醒
const { createMessage: $message } = useMessage(); // 解构

//设置标题
const title = '使用微信扫码支付';
const qrCodeUrl = ref('');
//表单赋值
const [registerModal] = useModalInner(async (data) => {
  // console.log('弹出框-接收到的数据为：', JSON.stringify(data));
  //{"payData":{"productId":"1","amount":"0.01","payType":"wxpay"}}
  let payResult = await nativePay(data.payData);
  qrCodeUrl.value = payResult.codeUrl;
});


//表单提交事件
async function handleSubmit(v) {
  // closeModal();
}

/**
 * 成功
 */
function success() {

}
</script>

<style scoped>
/*查询组件input有后缀，隐藏掉*/
:deep(.ant-input-suffix) {
  display: none;
}
</style>
